<html>
  <head>
    <title>UBSpatial Visualisation Demonstrator</title>
    <link rel="stylesheet" href="/openlayers/theme/default/style.css" type="text/css">
    <link rel="stylesheet" href="/openlayers/theme/default/google.css" type="text/css">
<!--
    <link rel="stylesheet" href="http://openlayers.org/api/theme/default/style.css" type="text/css" />
    <link rel="stylesheet" href="http://openlayers.org/dev/examples/style.css" type="text/css" />
-->
	
	<!-- Basic CSS definitions -->
	<style type="text/css">
		/* General settings */
		body {
			font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
			font-size: small;
		}
		/* Toolbar styles */
		#toolbar {
			position: relative;
			padding-bottom: 0.5em;
			display: none;
		}
		
		#toolbar ul {
			list-style: none;
			padding: 0;
			margin: 0;
		}
		
		#toolbar ul li {
			float: left;
			padding-right: 1em;
			padding-bottom: 0.5em;
		}
		
		#toolbar ul li a {
			font-weight: bold;
			font-size: smaller;
			vertical-align: middle;
			color: black;
			text-decoration: none;
		}

		#toolbar ul li a:hover {
			text-decoration: underline;
		}
		
		#toolbar ul li * {
			vertical-align: middle;
		}

		/* The map and the location bar */
		#map {
			clear: both;
			position: relative;
			width: 512px;
			height: 441px;
			border: 1px solid black;
		}
		
		#wrapper {
			width: 512px;
		}
		
		#location {
			float: right;
		}
		
		#options {
			position: absolute;
			left: 13px;
			top: 7px;
			z-index: 3000;
		}

		/* Styles used by the default GetFeatureInfo output, added to make IE happy */
		table.featureInfo, table.featureInfo td, table.featureInfo th {
			border: 1px solid #ddd;
			border-collapse: collapse;
			margin: 0;
			padding: 0;
			font-size: 90%;
			padding: .2em .1em;
		}
		
		table.featureInfo th {
			padding: .2em .2em;
			text-transform: uppercase;
			font-weight: bold;
			background: #eee;
		}
		
		table.featureInfo td {
			background: #fff;
		}
		
		table.featureInfo tr.odd td {
			background: #eee;
		}
		
		table.featureInfo caption {
			text-align: left;
			font-size: 100%;
			font-weight: bold;
			text-transform: uppercase;
			padding: .2em .2em;
		}
	</style>

	<!--
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.6&amp;sensor=false"></script>
	-->

    <script type="text/javascript" src="/openlayers/OpenLayers.js"></script>
	<!--
    <script type="text/javascript" src="/openlayers/lib/OpenLayers.js"></script>
    <script type="text/javascript" src="http://openlayers.org/api/OpenLayers.js"></script>
    <script type="text/javascript" src="http://geoserver.geodatawiz.com/openlayers/OpenLayers.js"></script>
    <script type="text/javascript" src="http://localhost:8080/geoserver/openlayers/OpenLayers.js"></script>
	-->
    <script src="date.js" type="text/javascript"></script>
    <script src="lib_bore.js" type="text/javascript"></script>
    <script src="lib_data.js" type="text/javascript"></script>
    <script src="bores_vis_5.js" type="text/javascript"></script>
  </head>

  <body onload="init()">
    <h1 id="title">UBSpatial Visualisation Demonstrator</h1>
    <div id="map" class="smallmap"></div>
    <div id="wrapper">
		<div id="location">location</div>
		<div id="scale">
		</div>
    </div>
	<input type="button" value="Show" onClick="showAllFeatures()">
	<input type="button" value="Raw" onClick="getRaw()">
	<input type="button" value="Box" onClick="getBox()">
	<input type="button" value="Show Box" onClick="showFeatures()">
	<input type="checkbox" name="allow-draw" value="allow-draw" id="allowDrawCheckbox" onclick="toggleDraw(this);" />
	<label for="allowDrawCheckbox">enable line drawing</label>
	
    <div id="nodelist">
        <em>Click on the map to get feature info</em>
    </div>
  </body>

</html>
